/* The CSS for the table was based of an example at wc3 schools. 
http://www.w3schools.com/css/tryit.asp?filename=trycss_table_fancy
*/

.liste
{
    margin: 0 auto;
    width: 800px;
}
.menu
{
    float: left;
    border: 1px black solid;
    margin-right: 20px;
}

table.listing 
{
font-family: Arial, Helvetica, sans-serif;
width:80%;
border-collapse:collapse;
}


.listing td, th 
{
font-size:1em;
border:1px solid #98bf21;
padding:3px 7px 2px 7px;
}

.listing th
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color:#A7C942;
color:#ffffff;
}

.listing tr.alt td 
{
color:#000000;
background-color:#EAF2D3;
}


/* unvisited link */
a:link 
{
	text-decoration:none;
	color:#000000; 
}

/* visited link */
a:visited 
{
	text-decoration:none; 
	color: #707070 ;
}

a:hover {text-decoration:underline;}   /* mouse over link */
a:active {text-decoration:underline;}  /* selected link */

/* The CSS for the form was taken from this project. 
https://github.com/pmcelhaney/semantic-form.css/blob/master/index.html
*/

form.semantic {
	width:70%;
}

form.semantic fieldset
{
	clear: both;
	margin: 1em 0 0 0;
	padding: 10px;
	overflow: auto;
	background-color: #f8f8f8;
	border: 1px solid #888;
}

form.semantic legend
{
	font-weight: bold;
}

form.semantic div
{
	clear: both;
	margin: 0;
	padding: 0.5em 0 0 0;
	overflow: visible;
}


form.semantic label 
{
	display: block;
	float: left;
	width: 120px;
	text-align: right;
	padding: 2px 1ex 6px 0;
	vertical-align: baseline;
}
          
form.semantic label.after 
{
	width: auto;
	text-align: left; 
	display: inline; 
	float: none;
}

form.semantic label.long 
{
	clear: both;
	width: auto;
	text-align: left;
	float: none;
}

form.semantic input
, form.semantic select
, form.semantic textarea
{
	float: left;
}

form.semantic input.date {
	width : 100px;
}


form.semantic input.money {
	width : 100px;
}

form.semantic input[type=radio]
, form.semantic input[type=checkbox]
{
	vertical-align: text-bottom;
}

form.semantic ul {
	list-style-type: none; 
	float: left;
	padding: 0;
	margin: 0;
}

form.semantic li {
	clear: both;
	padding: 0.2em 0;
}

form.semantic li label {
	width: auto;
	text-align: left;
	padding: 0;
}   

form.semantic div.field-row 
{
	clear: none;
	float: left;
	margin: 0;
	padding: 0;
	overflow: visible;
}

form.semantic div.field-row *
{
	float: none;
	display: inline;
}

form.semantic .button-row
{
	text-align: right;
}

form.semantic .button-row input
{
	float: none;
}

form.semantic div.long label 
{
	width: auto;
	text-align: left;  
	float: none;
}

form.semantic div.long textarea 
{
	width: 100%;
}

/* Errors -- for use with JQuery Validate, etc. */

form.semantic input.error
, form.semantic select.error
, form.semantic textarea.error
{
	background-color: #77002a;
	color: white;
}                                                

form.semantic label.error
{
	width: auto;
	color: #77002a;
	text-align: left;
}       

/* from caucho.com */
#footer hr
{
  width: 100%;
}
#footer
{
  font-size: 80%;
  text-align: right;
}

/* bottom nav */

.bottom {
  font-family: Verdana, Helvetica, Arial, sans-serif;
  font-size : 90%;
  color : #999;
}

ul.bottom {
  list-style-type : none;
  padding : 0em;
  margin : 0;
  margin-top : 3em;
  text-align : center;
}

.bottom li {
  display : inline;
  margin : 0.1em 0.1em;
  padding : 0.0em;
}

.bottom a {
  color : #999;
}

.bottom a:hover {
  color : #ffcc33;
}

/* bottom */

.about {
  color : #999;
  font-family : Helvetica, Arial, sans-serif;
  text-align : center;
  font-size : 90%;
}

div.about {
  margin-top : 1em;
}